<template>
    <div>
        <el-carousel :interval="4000" type="card" height="400px">
            <el-carousel-item v-for="(item, index) in imgUrl" :key="index">
                <!-- <h3 class="medium">{{ item.url }}</h3> -->
                <img :src="item.url" alt="" width="100%" height="100%" />
            </el-carousel-item>
        </el-carousel>
        <div class="customer_row">
            <div class="customer_inner">
                <div v-for="(boxItem, index) in moduleBox" class="ev-module-edit-box" :class="`bg_${index}`" :key="index">
                    <div class="ev-pic ev-pic-1" style="position: absolute; width: 53px; height: 63px; left: 59px; top: 59px; z-index: 1">
                        <img
                            :src="boxItem.imgUrl"
                            class="default-img"
                            data-original-src="//aimg8.dlszyht.net.cn/module/simplepicbackground/1749083/3579/7157267_1534752710.png?x-oss-process=image/resize,m_fixed,w_53,h_63,limit_0"
                        />
                    </div>
                    <div
                        id="evMo_bbACXi"
                        class="ev-module-edit"
                        style="position: absolute; width: 114px; height: 79px; left: 142px; top: 39px; z-index: 2"
                    >
                        <div class="ev-module-text" id="Mo_bbACXi">
                            <span style="font-family: 微软雅黑; color: #ffffff; font-size: 16px"
                                ><strong
                                    ><span style="font-size: 60px">{{ boxItem.maxNumber }}</span
                                    >人</strong
                                ></span
                            >
                        </div>
                    </div>
                    <div
                        id="evMo_SOibPg"
                        class="ev-module-edit"
                        style="position: absolute; width: 109px; height: 33px; left: 146px; top: 110px; z-index: 3"
                    >
                        <div class="ev-module-text ev-module-edit-box" id="Mo_SOibPg">
                            <span style="font-family: 微软雅黑; font-size: 14px; color: #ffffff"
                                >{{ boxItem.num }}人{{ boxItem.text }}</span
                            >
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <div class="" style="height: 600px; overflow: hidden">
            <h1 style="text-align: center">
                <span style="font-family: 微软雅黑; font-size: 40px; color: #333333">团体优惠</span>
            </h1>
            <div class="customer_inner" style="margin: 0 auto">
                <div class="modulePA" style="height: 670px; display: flex; margin: 0 auto">
                    <div
                        class="ev-module-edit ev-container ev-box-container"
                        id="evMo_rP3nPd"
                        style="width: 580px; height: 417px; left: 0px; top: 219px; z-index: 2; margin: 10px"
                    >
                        <div
                            class="ev-module-edit-box"
                            data-animate-name="fadeInUp"
                            data-animate-duration="1.00s"
                            data-animate-delay="0.10s"
                            id="Mo_rP3nPd"
                            data-loadanimate="1"
                            style=""
                        >
                            <div class="ev-container-wap">
                                <div class="ev-container-bg"></div>
                                <div
                                    id="evMo_toCKnq"
                                    class="ev-module-edit"
                                    style="position: absolute; width: 580px; height: 370px; left: 0px; top: 0px; z-index: 1"
                                >
                                    <div class="ev-module-edit-box" id="Mo_toCKnq" data-loadanimate="1">
                                        <a href="###">
                                            <div class="ev-pic ev-pic-1">
                                                <img
                                                    src="http://aimg8.dlszyht.net.cn/module/simplepicbackground/1749083/3580/7158344_1534754038.jpg?x-oss-process=image/resize,m_fixed,w_580,h_370,limit_0"
                                                    class="default-img"
                                                    data-original-src="//aimg8.dlszyht.net.cn/module/simplepicbackground/1749083/3580/7158344_1534754038.jpg?x-oss-process=image/resize,m_fixed,w_580,h_370,limit_0"
                                                />
                                            </div>
                                        </a>
                                    </div>
                                </div>
                                <div
                                    id="evMo_xxa6v9"
                                    class="ev-module-edit"
                                    style="position: absolute; width: 45px; height: 45px; left: 506px; top: 289px; z-index: 2"
                                >
                                    <div class="ev-module-edit-box" id="Mo_xxa6v9" data-loadanimate="1">
                                        <a href="">
                                            <div class="ev-pic ev-pic-4 int-changeimg-fade int-dom">
                                                <img
                                                    v-show="!addVisible"
                                                    @mouseenter="addVisible = !addVisible"
                                                    @mouseleave="addVisible = !addVisible"
                                                    src="http://aimg8.dlszyht.net.cn/module/simplepicbackground/1749083/3580/7158367_1534754059.png?x-oss-process=image/resize,m_fixed,w_45,h_45,limit_0"
                                                    class="default-img"
                                                    data-original-src="//aimg8.dlszyht.net.cn/module/simplepicbackground/1749083/3580/7158367_1534754059.png?x-oss-process=image/resize,m_fixed,w_45,h_45,limit_0"
                                                />
                                                <div class="int-add-dom" v-show="addVisible">
                                                    <div class="bgzz" style=""></div>
                                                    <div class="figcaption">
                                                        <img
                                                            alt="模块标题"
                                                            src="//aimg8.dlszyht.net.cn/module/simplepicbackground/1749083/3580/7158381_1534754080.png?t=221"
                                                        />
                                                    </div>
                                                </div>
                                            </div>
                                        </a>
                                    </div>
                                </div>
                                <div
                                    id="evMo_9WTxcL"
                                    class="ev-module-edit"
                                    style="position: absolute; width: 200px; height: 48px; left: 40px; top: 276px; z-index: 3"
                                >
                                    <div class="ev-module-text ev-module-edit-box" id="Mo_9WTxcL" data-loadanimate="1">
                                        <span style="color: #ffffff; font-size: 26px; font-family: 微软雅黑">公司/团体组织</span>
                                    </div>
                                </div>
                                <div
                                    id="evMo_Dynxja"
                                    class="ev-module-edit"
                                    style="position: absolute; width: 275px; height: 29px; left: 40px; top: 323px; z-index: 4"
                                >
                                    <div class="ev-module-text ev-module-edit-box" id="Mo_Dynxja" data-loadanimate="1">
                                        <span style="color: #ffffff; font-size: 14px; font-family: 微软雅黑"
                                            >20人以上，享受八折优惠，送烤全羊</span
                                        >
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div
                        class="ev-module-edit ev-container ev-box-container"
                        id="evMo_rP3nPd"
                        style="width: 580px; height: 417px; left: 0px; top: 219px; z-index: 2; margin: 10px"
                    >
                        <div
                            class="ev-module-edit-box"
                            data-animate-name="fadeInUp"
                            data-animate-duration="1.00s"
                            data-animate-delay="0.10s"
                            id="Mo_rP3nPd"
                            data-loadanimate="1"
                            style=""
                        >
                            <div class="ev-container-wap">
                                <div class="ev-container-bg"></div>
                                <div
                                    id="evMo_toCKnq"
                                    class="ev-module-edit"
                                    style="position: absolute; width: 580px; height: 370px; left: 0px; top: 0px; z-index: 1"
                                >
                                    <div class="ev-module-edit-box" id="Mo_toCKnq" data-loadanimate="1">
                                        <a href="###">
                                            <div class="ev-pic ev-pic-1">
                                                <img
                                                    src="http://aimg8.dlszyht.net.cn/module/simplepicbackground/1749083/3580/7158542_1534754270.jpg?x-oss-process=image/resize,m_fixed,w_580,h_370,limit_0"
                                                    class="default-img"
                                                    data-original-src="http://aimg8.dlszyht.net.cn/module/simplepicbackground/1749083/3580/7158542_1534754270.jpg?x-oss-process=image/resize,m_fixed,w_580,h_370,limit_0"
                                                />
                                            </div>
                                        </a>
                                    </div>
                                </div>
                                <div
                                    id="evMo_xxa6v9"
                                    class="ev-module-edit"
                                    style="position: absolute; width: 45px; height: 45px; left: 506px; top: 289px; z-index: 2"
                                >
                                    <div class="ev-module-edit-box" id="Mo_xxa6v9" data-loadanimate="1">
                                        <a href="">
                                            <div class="ev-pic ev-pic-4 int-changeimg-fade int-dom">
                                                <img
                                                    v-show="!addVisible1"
                                                    @mouseenter="addVisible1 = !addVisible1"
                                                    @mouseleave="addVisible1 = !addVisible1"
                                                    src="http://aimg8.dlszyht.net.cn/module/simplepicbackground/1749083/3580/7158367_1534754059.png?x-oss-process=image/resize,m_fixed,w_45,h_45,limit_0"
                                                    class="default-img"
                                                    data-original-src="//aimg8.dlszyht.net.cn/module/simplepicbackground/1749083/3580/7158367_1534754059.png?x-oss-process=image/resize,m_fixed,w_45,h_45,limit_0"
                                                />
                                                <div class="int-add-dom" v-show="addVisible1">
                                                    <div class="bgzz" style=""></div>
                                                    <div class="figcaption">
                                                        <img
                                                            alt="模块标题"
                                                            src="//aimg8.dlszyht.net.cn/module/simplepicbackground/1749083/3580/7158381_1534754080.png?t=221"
                                                        />
                                                    </div>
                                                </div>
                                            </div>
                                        </a>
                                    </div>
                                </div>
                                <div
                                    id="evMo_9WTxcL"
                                    class="ev-module-edit"
                                    style="position: absolute; width: 200px; height: 48px; left: 40px; top: 276px; z-index: 3"
                                >
                                    <div class="ev-module-text ev-module-edit-box" id="Mo_9WTxcL" data-loadanimate="1">
                                        <span style="color: #ffffff; font-size: 26px; font-family: 微软雅黑">家庭团体</span>
                                    </div>
                                </div>
                                <div
                                    id="evMo_Dynxja"
                                    class="ev-module-edit"
                                    style="position: absolute; width: 275px; height: 29px; left: 40px; top: 323px; z-index: 4"
                                >
                                    <div class="ev-module-text ev-module-edit-box" id="Mo_Dynxja" data-loadanimate="1">
                                        <span style="color: #ffffff; font-size: 14px; font-family: 微软雅黑"
                                            >6人以上，享受八折优惠，送烤全羊</span
                                        >
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <div style="margin-bottom: 60px; overflow: hidden">
            <h1 class="ev-text-title-1" style="text-align: center">
                <span style="font-family: 微软雅黑; font-size: 40px; color: #333333">景点介绍</span>
            </h1>
            <div style="width: 1200px; display: flex; margin: 0 auto">
                <div v-for="(sightItem, index) in sightImage" :key="index" style="width: 290px; height: 390px; margin: 5px">
                    <img :src="sightItem.imgUrl" alt="" style="width: 100%; hegiht: 100%" />
                </div>
            </div>
        </div>
        <div style="margin-bottom: 60px; overflow: hidden">
            <h1 class="ev-text-title-1" style="text-align: center">
                <span style="font-family: 微软雅黑; font-size: 40px; color: #333333">农家美食</span>
            </h1>
            <div style="width: 1200px; margin: 0 auto">
                <el-carousel height="400px">
                    <!-- <el-carousel-item v-for="item in 4" :key="item">
                        <h3 class="small">{{ item }}</h3>
                    </el-carousel-item> -->
                    <el-carousel-item v-for="(foodItem, index) in foodImage" :key="index">
                        <div style="width: 1200px; display: flex; overflow: hidden; flex-wrap: wrap">
                            <div v-for="(foodListItem, index) in foodItem" :key="index" style="width: 285px; height: 180px; margin: 5px">
                                <img :src="foodListItem.imgUrl" alt="" style="width: 100%; height: 100%" />
                            </div>
                        </div>
                    </el-carousel-item>
                </el-carousel>
            </div>
        </div>
        <div class="content_item">
            <h1 class="ev-text-title-1" style="text-align: center">
                <span style="font-family: 微软雅黑; font-size: 40px; color: #333333">农家娱乐</span>
            </h1>
            <div style="width: 1200px; display: flex; margin: 0 auto; overflow: hidden; flex-wrap: wrap">
                <div v-for="(amuseMentImageItem, index) in amuseMentImage" :key="index" style="width: 384px; margin: 5px; overflow: hidden">
                    <img :src="amuseMentImageItem.imgUrl" alt="" style="width: 384px; hegiht: 240px" />
                    <div class="pic-attr" style="">
                        <h3 class="pic-title">
                            <a class="">{{ amuseMentImageItem.title }}</a>
                        </h3>
                        <div class="pic-intro">
                            <p>{{ amuseMentImageItem.content }}</p>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <div class="content_item">
            <div style="margin: 0 auto; width: 1000px">
                <div class="mod mod-reviews">
                    <div class="mhd mhd-large">
                        哎哟哟点评<span>（共有<em>4</em>条真实评价）</span>
                        <!-- <span class="btn-reviews" @click="handleDiscuss">我要点评</span> -->
                        <el-button class="btn-reviews" @click="open">我要点评</el-button>
                    </div>
                </div>
                <div class="review-nav">
                    <ul class="clearfix">
                        <li data-type="0" data-category="0" class="on">
                            <span class="divide"></span><a href="javascript:void(0);"><span>全部</span></a>
                        </li>
                        <li data-type="0" data-category="2" class="">
                            <span class="divide"></span>
                            <a href="javascript:void(0);"><span>有图</span><span class="num"> (1条)</span></a>
                        </li>
                        <li data-type="1" data-category="13" class="">
                            <span class="divide"></span>
                            <a href="javascript:void(0);">
                                <span>好评</span>
                                <span class="num">（3条）</span>
                            </a>
                        </li>
                        <li data-type="1" data-category="12" class="">
                            <span class="divide"></span>
                            <a href="javascript:void(0);">
                                <span>中评</span>
                                <span class="num">（1条）</span>
                            </a>
                        </li>
                        <li data-type="2" data-category="179719808" class="">
                            <span class="filter-word divide"></span>
                            <a href="javascript:void(0);">交通方便<span class="num">（1人提及）</span></a>
                        </li>
                    </ul>
                </div>
                <div class="comment_list">
                    <div class="rev-list">
                        <ul>
                            <li class="rev-item" v-for="(revItem, index) in allDiscuss" :key="index">
                                <div class="user">
                                    <a class="avatar" href="/u/81992841.html" target="_blank"
                                        ><img :src="revItem.icon" width="48" height="48" /></a
                                    ><span class="level">LV.{{ revItem.user_level }}</span>
                                </div>
                                <a class="name" href="/u/81992841.html" target="_blank">{{ revItem.user_name }}</a>
                                <span class="s-star s-star4"></span>
                                <p class="rev-txt">
                                    {{ revItem.discuss_content }}
                                </p>
                                <div class="rev-img">
                                    <a
                                        href="/photo/poi/7047903_323566580.html"
                                        target="_blank"
                                        v-for="(imageItem, index) in revItem.allImage"
                                        :key="index"
                                        ><img :src="imageItem" height="120"
                                    /></a>
                                </div>
                                <div class="info clearfix">
                                    <a class="btn-comment _j_comment" title="添加评论">评论</a>
                                    <span class="time">{{ revItem.discuss_time }}</span>
                                    <span class="from">
                                        此条点评来自<a href="/app/intro/gonglve.php" target="_blank">{{ revItem.discuss_from }}</a>
                                    </span>
                                </div>
                            </li>
                        </ul>
                    </div>
                    <el-dialog title="" :visible.sync="getVislble" width="850px" :before-close="handleClose">
                        <span>这是一段信息</span>
                        <span slot="footer" class="dialog-footer">
                            <h2>
                                <strong style="margin-left: 100px">天下第一农庄</strong>
                                <em>*</em>为必填选项
                            </h2>
                            <el-form :model="ruleForm" ref="ruleForm" label-width="200px" class="demo-ruleForm">
                                <el-form-item label="总体评价:" prop="star">
                                    <el-radio-group v-model="ruleForm.star" size="medium" style="float: left">
                                        <el-radio-button label="1"></el-radio-button>
                                        <el-radio-button label="2"></el-radio-button>
                                        <el-radio-button label="3"></el-radio-button>
                                        <el-radio-button label="4"></el-radio-button>
                                        <el-radio-button label="5"></el-radio-button>
                                    </el-radio-group>
                                </el-form-item>
                                <el-form-item label="内容" prop="content" required>
                                    <el-input
                                        type="textarea"
                                        v-model="ruleForm.content"
                                        placeholder="100字+照片，有机会评委优质好评"
                                    ></el-input>
                                </el-form-item>
                                <el-form-item label="活动时间">
                                    <el-upload
                                        style="float: left"
                                        class="avatar-uploader"
                                        action="https://jsonplaceholder.typicode.com/posts/"
                                        :show-file-list="false"
                                        :on-success="handleAvatarSuccess"
                                        :before-upload="beforeAvatarUpload"
                                    >
                                        <img v-if="imageUrl" :src="imageUrl" class="avatar" />
                                        <i v-else class="el-icon-plus avatar-uploader-icon"></i>
                                    </el-upload>
                                </el-form-item>
                            </el-form>
                            <p style="text-align: center">
                                <el-button @click="addDiscussVisible = false">取 消</el-button>
                                <el-button type="primary" @click="addDiscussVisible = false">确 定</el-button>
                            </p>
                        </span>
                    </el-dialog>
                </div>
            </div>
        </div>
    </div>
</template>

<script>
import { getDiscuss, getUser } from '../../../api/index';
export default {
    data() {
        return {
            imgUrl: [
                {
                    url: 'https://ss1.bdstatic.com/70cFuXSh_Q1YnxGkpoWK1HF6hhy/it/u=1126250819,3369280114&fm=26&gp=0.jpg'
                },
                {
                    url: 'https://dss1.bdstatic.com/70cFuXSh_Q1YnxGkpoWK1HF6hhy/it/u=1067724635,2701036416&fm=26&gp=0.jpg'
                },
                {
                    url: 'https://dss1.bdstatic.com/70cFuXSh_Q1YnxGkpoWK1HF6hhy/it/u=2298782795,3073931092&fm=26&gp=0.jpg'
                },
                {
                    url: 'https://dss0.bdstatic.com/70cFvHSh_Q1YnxGkpoWK1HF6hhy/it/u=2515393908,4026186994&fm=26&gp=0.jpg'
                }
            ],
            moduleBox: [
                {
                    imgUrl:
                        'http://aimg8.dlszyht.net.cn/module/simplepicbackground/1749083/3579/7157267_1534752710.png?x-oss-process=image/resize,m_fixed,w_53,h_63,limit_0',
                    maxNumber: 50,
                    number: 50,
                    text: '同时就餐'
                },
                {
                    imgUrl:
                        'http://aimg8.dlszyht.net.cn/module/simplepicbackground/1749083/3579/7157281_1534752731.png?x-oss-process=image/resize,m_fixed,w_62,h_54,limit_0',
                    maxNumber: 50,
                    number: 50,
                    text: '同时住宿'
                },
                {
                    imgUrl:
                        'http://aimg8.dlszyht.net.cn/module/simplepicbackground/1749083/3579/7157297_1534752749.png?x-oss-process=image/resize,m_fixed,w_51,h_62,limit_0',
                    maxNumber: 20,
                    number: 20,
                    text: '房间数量'
                },
                {
                    imgUrl:
                        'http://aimg8.dlszyht.net.cn/module/simplepicbackground/1749083/3579/7157281_1534752731.png?x-oss-process=image/resize,m_fixed,w_62,h_54,limit_0',
                    maxNumber: 100,
                    number: 100,
                    text: '人均消费'
                }
            ],
            addVisible: false,
            addVisible1: false,
            sightImage: [
                {
                    imgUrl:
                        'http://aimg8.dlszyht.net.cn/module_pic_con/800_1500/1749083/3581/7161171_1534758123.jpg?x-oss-process=image/resize,m_lfit,w_291,h_425,limit_0'
                },
                {
                    imgUrl:
                        'http://aimg8.dlszyht.net.cn/module_pic_con/800_1500/1749083/3581/7161164_1534758110.jpg?x-oss-process=image/resize,m_lfit,w_291,h_425,limit_0'
                },
                {
                    imgUrl:
                        'http://aimg8.dlszyht.net.cn/module_pic_con/800_1500/1749083/3581/7161153_1534758091.jpg?x-oss-process=image/resize,m_lfit,w_291,h_425,limit_0'
                },
                {
                    imgUrl:
                        'http://aimg8.dlszyht.net.cn/module_pic_con/800_1500/1749083/3581/7161135_1534758067.jpg?x-oss-process=image/resize,m_lfit,w_291,h_425,limit_0'
                }
            ],
            foodImage: [
                [
                    {
                        imgUrl:
                            'http://aimg8.dlszyht.net.cn/module_pic_con/800_1500/1749083/3580/7159223_1534755218.png?x-oss-process=image/resize,m_lfit,w_285,h_180,limit_0'
                    },
                    {
                        imgUrl:
                            'http://aimg8.dlszyht.net.cn/module_pic_con/800_1500/1749083/3580/7159215_1534755210.png?x-oss-process=image/resize,m_lfit,w_285,h_180,limit_0'
                    },
                    {
                        imgUrl:
                            'http://aimg8.dlszyht.net.cn/module_pic_con/800_1500/1749083/3580/7159206_1534755201.png?x-oss-process=image/resize,m_lfit,w_285,h_180,limit_0'
                    },
                    {
                        imgUrl:
                            'http://aimg8.dlszyht.net.cn/module_pic_con/800_1500/1749083/3580/7159215_1534755210.png?x-oss-process=image/resize,m_lfit,w_285,h_180,limit_0'
                    },
                    {
                        imgUrl:
                            'http://aimg8.dlszyht.net.cn/module_pic_con/800_1500/1749083/3580/7159191_1534755181.png?x-oss-process=image/resize,m_lfit,w_285,h_180,limit_0'
                    },
                    {
                        imgUrl:
                            'http://aimg8.dlszyht.net.cn/module_pic_con/800_1500/1749083/3580/7159180_1534755171.png?x-oss-process=image/resize,m_lfit,w_285,h_180,limit_0'
                    },
                    {
                        imgUrl:
                            'http://aimg8.dlszyht.net.cn/module_pic_con/800_1500/1749083/3580/7159215_1534755210.png?x-oss-process=image/resize,m_lfit,w_285,h_180,limit_0'
                    },
                    {
                        imgUrl:
                            'http://aimg8.dlszyht.net.cn/module_pic_con/800_1500/1749083/3580/7159159_1534755145.png?x-oss-process=image/resize,m_lfit,w_285,h_180,limit_0'
                    }
                ],
                [
                    {
                        imgUrl:
                            'http://aimg8.dlszyht.net.cn/module_pic_con/800_1500/1749083/3580/7159223_1534755218.png?x-oss-process=image/resize,m_lfit,w_285,h_180,limit_0'
                    },
                    {
                        imgUrl:
                            'http://aimg8.dlszyht.net.cn/module_pic_con/800_1500/1749083/3580/7159215_1534755210.png?x-oss-process=image/resize,m_lfit,w_285,h_180,limit_0'
                    },
                    {
                        imgUrl:
                            'http://aimg8.dlszyht.net.cn/module_pic_con/800_1500/1749083/3580/7159206_1534755201.png?x-oss-process=image/resize,m_lfit,w_285,h_180,limit_0'
                    },
                    {
                        imgUrl:
                            'http://aimg8.dlszyht.net.cn/module_pic_con/800_1500/1749083/3580/7159215_1534755210.png?x-oss-process=image/resize,m_lfit,w_285,h_180,limit_0'
                    },
                    {
                        imgUrl:
                            'http://aimg8.dlszyht.net.cn/module_pic_con/800_1500/1749083/3580/7159191_1534755181.png?x-oss-process=image/resize,m_lfit,w_285,h_180,limit_0'
                    },
                    {
                        imgUrl:
                            'http://aimg8.dlszyht.net.cn/module_pic_con/800_1500/1749083/3580/7159180_1534755171.png?x-oss-process=image/resize,m_lfit,w_285,h_180,limit_0'
                    },
                    {
                        imgUrl:
                            'http://aimg8.dlszyht.net.cn/module_pic_con/800_1500/1749083/3580/7159215_1534755210.png?x-oss-process=image/resize,m_lfit,w_285,h_180,limit_0'
                    },
                    {
                        imgUrl:
                            'http://aimg8.dlszyht.net.cn/module_pic_con/800_1500/1749083/3580/7159159_1534755145.png?x-oss-process=image/resize,m_lfit,w_285,h_180,limit_0'
                    }
                ],
                [
                    {
                        imgUrl:
                            'http://aimg8.dlszyht.net.cn/module_pic_con/800_1500/1749083/3580/7159223_1534755218.png?x-oss-process=image/resize,m_lfit,w_285,h_180,limit_0'
                    },
                    {
                        imgUrl:
                            'http://aimg8.dlszyht.net.cn/module_pic_con/800_1500/1749083/3580/7159215_1534755210.png?x-oss-process=image/resize,m_lfit,w_285,h_180,limit_0'
                    },
                    {
                        imgUrl:
                            'http://aimg8.dlszyht.net.cn/module_pic_con/800_1500/1749083/3580/7159206_1534755201.png?x-oss-process=image/resize,m_lfit,w_285,h_180,limit_0'
                    },
                    {
                        imgUrl:
                            'http://aimg8.dlszyht.net.cn/module_pic_con/800_1500/1749083/3580/7159215_1534755210.png?x-oss-process=image/resize,m_lfit,w_285,h_180,limit_0'
                    },
                    {
                        imgUrl:
                            'http://aimg8.dlszyht.net.cn/module_pic_con/800_1500/1749083/3580/7159191_1534755181.png?x-oss-process=image/resize,m_lfit,w_285,h_180,limit_0'
                    },
                    {
                        imgUrl:
                            'http://aimg8.dlszyht.net.cn/module_pic_con/800_1500/1749083/3580/7159180_1534755171.png?x-oss-process=image/resize,m_lfit,w_285,h_180,limit_0'
                    },
                    {
                        imgUrl:
                            'http://aimg8.dlszyht.net.cn/module_pic_con/800_1500/1749083/3580/7159215_1534755210.png?x-oss-process=image/resize,m_lfit,w_285,h_180,limit_0'
                    },
                    {
                        imgUrl:
                            'http://aimg8.dlszyht.net.cn/module_pic_con/800_1500/1749083/3580/7159159_1534755145.png?x-oss-process=image/resize,m_lfit,w_285,h_180,limit_0'
                    }
                ]
            ],
            amuseMentImage: [
                {
                    imgUrl:
                        'http://aimg8.dlszyht.net.cn/module_pic_con/800_1500/1749083/3581/7160073_1534756453.jpg?x-oss-process=image/resize,m_lfit,w_385,h_240,limit_0',
                    title: '划船比赛',
                    content: '团队组合划船的乐趣，回味无穷，越挫越勇'
                },
                {
                    imgUrl:
                        'http://aimg8.dlszyht.net.cn/module_pic_con/800_1500/1749083/3581/7160051_1534756433.jpg?x-oss-process=image/resize,m_lfit,w_385,h_240,limit_0',
                    title: '自助烧烤BBQ',
                    content: '团队组合划船的乐趣，回味无穷，越挫越勇'
                },
                {
                    imgUrl:
                        'http://aimg8.dlszyht.net.cn/module_pic_con/800_1500/1749083/3581/7160034_1534756398.jpg?x-oss-process=image/resize,m_lfit,w_385,h_240,limit_0',
                    title: '农场蔬果采摘体验',
                    content: '团队组合划船的乐趣，回味无穷，越挫越勇'
                },
                {
                    imgUrl:
                        'http://aimg8.dlszyht.net.cn/module_pic_con/800_1500/1749083/3581/7160021_1534756381.jpg?x-oss-process=image/resize,m_lfit,w_385,h_240,limit_0',
                    title: '篝火晚会',
                    content: '团队组合篝火的乐趣，回味无穷，越挫越勇'
                },
                {
                    imgUrl:
                        'http://aimg8.dlszyht.net.cn/module_pic_con/800_1500/1749083/3581/7160018_1534756367.jpg?x-oss-process=image/resize,m_lfit,w_385,h_240,limit_0',
                    title: '湖边垂钓',
                    content: '团队组合垂钓的乐趣，回味无穷，越挫越勇'
                },
                {
                    imgUrl:
                        'http://aimg8.dlszyht.net.cn/module_pic_con/800_1500/1749083/3580/7160000_1534756354.jpg?x-oss-process=image/resize,m_lfit,w_385,h_240,limit_0',
                    title: '峡谷漂流',
                    content: '团队组合垂钓的乐趣，回味无穷，越挫越勇'
                }
            ],
            discuss: '',
            user: '',
            allDiscuss: [],
            userIsLogin: this.$store.state.userisLogin,
            userLoginVisible: false,
            addDiscussVisible: false,
            ruleForm: {
                name: '',
                region: '',
                date1: '',
                date2: '',
                delivery: false,
                type: [],
                resource: '',
                desc: ''
            },
            rules: {
                name: [
                    { required: true, message: '请输入活动名称', trigger: 'blur' },
                    { min: 3, max: 5, message: '长度在 3 到 5 个字符', trigger: 'blur' }
                ],
                region: [{ required: true, message: '请选择活动区域', trigger: 'change' }],
                date1: [{ type: 'date', required: true, message: '请选择日期', trigger: 'change' }],
                date2: [{ type: 'date', required: true, message: '请选择时间', trigger: 'change' }],
                type: [{ type: 'array', required: true, message: '请至少选择一个活动性质', trigger: 'change' }],
                resource: [{ required: true, message: '请选择活动资源', trigger: 'change' }],
                desc: [{ required: true, message: '请填写活动形式', trigger: 'blur' }]
            },
            imageUrl: ''
        };
    },
    methods: {
        getData() {
            getDiscuss().then((res) => {
                console.log(res);
                if (res) {
                    this.discuss = res;
                    getUser().then((res) => {
                        if (res) {
                            this.user = res;
                            const discussList = [];
                            res.map((item) => {
                                // item代表user
                                this.discuss
                                    ? this.discuss.map((perv) => {
                                          // perv代表discuss
                                          if (item.userid === perv.user_id) {
                                              // console.log('true', prev.discuss_image);
                                              const discussItem = {
                                                  allImage: perv.discuss_image ? perv.discuss_image.split(',') : '',
                                                  ...item,
                                                  ...perv
                                              };
                                              //   discussItem.discuss_time = this.moment(discussItem.discuss_time * 1000).format(
                                              //       'YYYY-MM-DD h:mm:ss'
                                              //   );
                                              discussList.push(discussItem);
                                          }
                                      })
                                    : '';
                            });
                            // this.allDiscuss = discussList.sort((a, b) => {
                            //     return a.discuss_time - b.discuss_time;
                            // });
                            this.allDiscuss = discussList.sort(this.dateSort);
                            this.allDiscuss.map((item) => {
                                item.discuss_time = this.moment(item.discuss_time * 1000).format('YYYY-MM-DD h:mm:ss');
                            });
                            console.log(this.allDiscuss);
                        }
                    });
                }
            });
        },
        handleDiscuss() {
            if (!this.userIsLogin) {
                this.userLoginVisible = true;
                console.log('未登录');
            } else {
                this.userLoginVisible = false;
            }
        },
        handleClose(done) {
            this.$confirm('确认关闭？')
                .then((_) => {
                    this.addDiscussVisible = false;
                })
                .catch((_) => {});
        },
        open() {
            if (!this.userIsLogin) {
                this.$confirm('您还没有登录, 是否去登陆?', '提示', {
                    confirmButtonText: '确定',
                    cancelButtonText: '取消',
                    type: 'warning'
                })
                    .then(() => {
                        this.$router.push('/user_login');
                    })
                    .catch(() => {
                        this.$message({
                            type: 'info',
                            message: '已取消登录'
                        });
                    });
            } else {
                this.addDiscussVisible = true;
            }
        },
        dateSort(a, b) {
            // if (b.discuss_time - a.discuss_time) {
            //     return 0;
            // } else {
            //     return 1;
            // }
            return b.discuss_time - a.discuss_time;
        },
        handleAvatarSuccess(res, file) {
            this.imageUrl = URL.createObjectURL(file.raw);
        },
        beforeAvatarUpload(file) {
            const isJPG = file.type === 'image/jpeg';
            const isLt2M = file.size / 1024 / 1024 < 2;

            if (!isJPG) {
                this.$message.error('上传头像图片只能是 JPG 格式!');
            }
            if (!isLt2M) {
                this.$message.error('上传头像图片大小不能超过 2MB!');
            }
            return isJPG && isLt2M;
        }
    },
    computed: {
        getVislble() {
            return this.userIsLogin && this.addDiscussVisible;
        }
    },
    created() {
        this.getData();
    }
};
</script>

<style scoped>
.el-carousel__item h3 {
    color: #475669;
    font-size: 14px;
    opacity: 0.75;
    line-height: 200px;
    margin: 0;
}

.customer_row {
    display: flex;
    justify-content: center;
}
.customer_inner {
    width: 1200px;
    overflow: hidden;
    display: flex;
}
.ev-module-edit-box {
    width: 290px;
    height: 180px;
    position: relative;
    border-radius: 12px;
    margin: 10px;
}
.bg_0 {
    background: rgb(255, 147, 74) none no-repeat left top;
}
.bg_1 {
    background: rgb(0, 199, 163) none no-repeat left top;
}
.bg_2 {
    background: rgb(254, 104, 110) none no-repeat left top;
}
.bg_3 {
    background: rgb(94, 159, 243) none no-repeat left top;
}
.content_item {
    margin-bottom: 60px;
    overflow: hidden;
}
.pic-attr {
    overflow: hidden;
    margin: 0 auto;
}
.pic-title {
    padding-top: 18px;
    padding-bottom: 12px;
}
.mod {
    padding: 30px 0;
}
.mhd {
    font-size: 20px;
    color: #333;
    margin: -30px -3000px 30px;
    padding: 40px 3000px 0;
    border-top: 1px solid #eee;
    font-weight: normal;
}
.review-nav {
    padding-bottom: 50px;
    border-bottom: 1px solid #eee;
}
.review-nav li {
    float: left;
    margin: 5px 0;
    line-height: 24px;
    font-size: 14px;
}
.review-nav .on a {
    background-color: #fca729;
    color: #fff;
    display: inline-block;
}
.review-nav .on a {
    background-color: #fca729;
    color: #fff;
}
.review-nav a {
    color: #333;
    display: inline-block;
    padding: 0 15px;
    border-radius: 2px;
}
li {
    list-style: none;
}
.rev-list {
    padding: 0 30px;
    border-bottom: 1px solid #eee;
}
.rev-item {
    padding: 25px 0 20px 70px;
    border-bottom: 1px dashed #dedede;
}
.rev-item .user {
    float: left;
    margin-left: -70px;
    display: inline;
    text-align: center;
}
.rev-item .avatar {
    display: block;
    margin-bottom: 5px;
    width: 48px;
    height: 48px;
    border-radius: 50%;
    overflow: hidden;
}
.rev-item .level {
    color: #ea3c1a;
}
.rev-item .name {
    font-size: 14px;
}
a {
    background-color: transparent;
    text-decoration: none;
    color: #ff9d00;
    cursor: pointer;
}
.rev-item .s-star {
    display: inline-block;
    margin: 0 5px;
    vertical-align: -1px;
    *vertical-align: middle;
}
.s-star4 {
    background-position: -74px -90px;
}
.s-star {
    display: block;
    width: 67px;
    height: 13px;
    background: url('http://css.mafengwo.net/images/mdd/place/shopping-icons3.png') no-repeat -60px -90px;
    overflow: hidden;
}
.s-star4 {
    background-position: -74px -90px;
}
.rev-txt {
    margin: 8px 0 10px;
    font-size: 14px;
    line-height: 22px;
}
.rev-img {
    margin-bottom: 10px;
    overflow: hidden;
    *zoom: 1;
}
.rev-img a {
    float: left;
    margin-right: 10px;
}
.rev-item .info {
    font-size: 12px;
    margin-top: 5px;
    line-height: 20px;
}
.rev-item .btn-comment {
    float: right;
    line-height: 22px;
}
.rev-item .time {
    color: #999;
    margin-right: 20px;
}
.rev-item .info {
    margin-top: 5px;
    line-height: 20px;
}
.btn-reviews {
    display: inline-block;
    line-height: 35px;
    background-color: #ff9d00;
    padding: 0 30px;
    border-radius: 3px;
    color: #fff;
    font-size: 14px;
    margin-left: 600px;
}
.dialog-footer h2 {
    margin-bottom: 24px;
    font-size: 14px;
    font-weight: 400;
    text-align: left;
}
.dialog-footer h2 strong {
    padding-right: 10px;
    font-size: 22px;
    font-weight: 400;
    color: #444;
}
.dialog-footer h2 em,
.review-item .label em {
    font-style: normal;
    color: #ea3c1a;
}
.avatar-uploader .el-upload {
    border: 1px dashed #d9d9d9;
    border-radius: 6px;
    cursor: pointer;
    position: relative;
    overflow: hidden;
}
.avatar-uploader .el-upload:hover {
    border-color: #409eff;
}
.avatar-uploader-icon {
    font-size: 28px;
    color: #8c939d;
    width: 120px;
    height: 120px;
    line-height: 120px;
    text-align: center;
}
.avatar {
    width: 178px;
    height: 178px;
    display: block;
}
</style>